.home { // 类名为home的样式块
  .user { // 子元素为user的选择器
    display: flex; // 设置布局为flex布局
    align-items: center; // 垂直方向内容对齐方式为居中
    padding-bottom: 20px; // 设置底部内边距为20px
    margin-bottom: 20px; // 设置底部外边距为20px
    border-bottom: 1px solid #ccc; // 下边框为1px实线边框，颜色为灰色
    img { // 子元素为img的选择器
      width: 150px; // 设置宽度为150px
      height: 150px; // 设置高度为150px
      border-radius: 50%; // 设置圆角为50%
      margin-right: 40px; // 设置右边外边距为40px
    }
    &info { // 子元素为info的选择器
      .name { // 子元素为name的选择器
        font-size: 32px; // 设置字体大小为32px
        margin-bottom: 10px; // 设置底部外边距为10px
      }
      .access { // 子元素为access的选择器
        color: #999999; // 设置字体颜色为灰色
      }
    }
  }
  .login-info { // 子元素为login-info的选择器
    p { // p标签选择器
      line-height: 28px; // 设置行高为28px
      font-size: 14px; // 设置字体大小为14px
      color: #999999; // 设置字体颜色为灰色
      span { // span标签选择器
        color: #666666; // 设置字体颜色为深灰色
        margin-left: 60px; // 设置左边外边距为60px
      }
    }
  }
  .num { // 子元素为num的选择器
    display: flex; // 设置布局为flex布局
    flex-wrap: wrap; // 设置内容换行
    justify-content: space-between; // 水平方向内容分布方式为均匀分布
    .el-card { // 子元素为el-card的选择器
      width: 32%; // 设置宽度为32%
      margin-bottom: 20px; // 设置底部外边距为20px
    }
    .icon { // 子元素为icon的选择器
      font-size: 30px; // 设置字体大小为30px
      width: 80px; // 设置宽度为80px
      height: 80px; // 设置高度为80px
      text-align: center; // 文本居中对齐
      line-height: 80px; // 设置行高为80px
      color: #fff; // 设置字体颜色为白色
    }
    .detail { // 子元素为detail的选择器
      margin-left: 15px; // 设置左边外边距为15px
      display: flex; // 设置布局为flex布局
      flex-direction: column; // 设置垂直方向排列
      justify-content: center; // 垂直方向内容对齐方式为居中
      .num { // 子元素为num的选择器
        font-size: 30px; // 设置字体大小为30px
        margin-bottom: 10px; // 设置底部外边距为10px
      }
      .text { // 子元素为text的选择器
        font-size: 14px; // 设置字体大小为14px
        text-align: center; // 文本居中对齐
        color: #999999; // 设置字体颜色为灰色
      }
    }
  }
  .graph { // 子元素为graph的选择器
    margin-top: 20px; // 设置顶部外边距为20px
    display: flex; // 设置布局为flex布局
    justify-content: space-between; // 水平方向内容分布方式为均匀分布
    .el-card { // 子元素为el-card的选择器
      width: 48%; // 设置宽度为48%
    }
  }
}